// 操作元素登录与重置验证
import $ from 'jquery';
$(function () {
	// $('#loginForm')调用该方法，a=$('#loginForm').serializeArray()通过序列化表单值来创建数组
	/**
	 * [
	 *  {name: 'firstname', value: 'Hello'},
	 *  {name: 'lastname', value: 'World'},
	 *  {name: 'alias'}, // 值为空
	 * ]
	 */
	// $.fn.serializeObject = function () {
	// 	var o = {};
	//   var a = this.serializeArray();
	//   // 注意参数顺序，$.each（）是索引index在前，索引项item在后
	//   // $.each(arr,function(index,item){})
	// 	$.each(a, function () {
	// 		if (o[this.name]) {
	// 			if (!o[this.name].push) {
	// 				o[this.name] = [o[this.name]];
	// 			}
	// 			o[this.name].push(this.value || '');
	// 		} else {
	// 			o[this.name] = this.value || '';
	// 		}
	// 	});
	// 	return o;
	// };

	$.fn.serializeObject = function () {
		var a, o, h, i, e;
		//serializeArray后，a就成为数组
		/* 
		[
				{name:'user',value:'admin'},
				{name:'pwd',value:123}
		]
		
		*/
		a = this.serializeArray();
		o = {};
		h = o.hasOwnProperty;
		$.each(a, function (i, item) {
			if (!h.call(o, item.name)) {
				o[item.name] = item.value;
			}
		});
		return o;
	};
	// 登录按钮的点击事件
	$('.login').on('click', function () {
		// alert('这是登录按钮点击了');
		// const name = $('.user').val();
		// const pwd = $('.pwd').val();
		// console.log(name, pwd);
		$.ajax({
			url: '/login',
			type: 'post',
			// 提交的是仍然是查询字符串
			// data: $('#loginForm').serialize(),
			data: JSON.stringify($('#loginForm').serializeObject()), //contentType设定为了json字符串，所以需要stringify()方法转化为字符串
			contentType: 'application/json',
			success: function (data) {
				console.log(data);
				if (data == undefined) {
					alert('用户名或密码不能为空!');
					return;
				}
				data = JSON.parse(data);
				// 延时方法-模拟网络请求的响应时间
				setTimeout(() => {
					if (data.status == 200) {
						// 登录成功跳转到success.html
						// alert('登录成功');
						window.location.href = './success.html';
					} else {
						// 登录失败清空表单
						// formObject.reset() DOM原生方法，把表单重置为默认值  [0]把jquery对象转化为DOM对象
						$('#loginForm')[0].reset();
						alert('登录失败，请重新输入账号和密码!');
					}
				}, 1000);
			},
		});
	});
	// 重置按钮的点击事件
	$('.reset').on('click', function () {
		// js原生方法-表单域重置
		$('#loginForm')[0].reset();
	});
});
